<template>
    <section class="headTop">
  			<p>
  				<span class="title"><i></i>&nbsp;{{title}}</span>
  				<i class="headImg"></i>
				<span class="span_menu "
					:class="{'active':$store.state.activeTheme===item.val}"
					@click="routerPush(item.val)" 
					v-if="$store.state.ShowMenu"
					v-for="(item,index) in menu" :key="index"
					>{{item.name}}
                </span>
  			</p>
    </section>
</template>

<script>
    export default {
    	props:{
    		menu:Array, 
    	},
        data() {
          return {
          		title:'城市智信息一体化',
          };
        },
        methods: {
        	routerPush(val){
        		this.$router.push({name:val});
        	}
        },
        mounted(){
     	// console.log(this.$router);
     	// console.log(this.menu);
     	// this.currentPage = this.$router.history.current.name;
        },
    };
</script>

<style scoped="scoped">
	.headTop{
		overflow: hidden;
	}
    p{
    	height: 60px;
    	background: #202c50a1;
    	line-height: 60px;
    	padding: 0 100px 0 66px;
    	color: #F8F9F9;
    	font-size: 20px;
    }
   	.title i{
   		background: url(../assets/hotel_01.png);
	    background-position-x: 182px;
	    background-position-y: 0;
	    display: inline-block;
	    width: 30px;
	    height: 30px;
	    background-size: 722%;
	    vertical-align: sub;
   	}
   	.headImg{
        background: url(../assets/headImg.png);
        width: 30px;
        display: inline-block;
        height: 30px;
        background-size: 30px,30px;
        float: right;
        margin-top: 15px;
   	}
   	.span_menu{
        font-size: 15px;
        margin-right: 4%;
        cursor: pointer;
   	}
   	.span_menu.active{
	    border-bottom: solid 3px #fff;
        padding-bottom: 14px;
        border-bottom-left-radius: 2px;
        border-bottom-right-radius: 2px;
    	font-size: 18px;
    	font-weight: 600;
   	}
   	.span_menu:nth-of-type(2){
   		/*font-size: 20px;*/
   		margin-left: 80px;
   	}
</style>